
<template>
  <div class="goc-judge-page">
    <GocJudge
      :problem="currentProblem"
      :judgeMode="'loose'"
      :tolerance="2"
      :showDebugInfo="false"
      @judge-complete="onJudgeComplete"
      @code-submit="onCodeSubmit"
      @error="onError"
    />
  </div>
</template>

<script>
import GocJudge from '../components/GocJudge.vue'
import logger from '../utils/logger.js'

export default {
  name: 'GocJudgePage',
  components: {
    GocJudge
  },
  data() {
    return {
      currentProblem: {
        id: '1',
        title: '绘制锁头',
        description: '锁头是半径为25的橙色半圆,线条粗细为8。锁身是长60,宽50的灰色矩形',
        difficulty: '简单',
        timeLimit: 5000,
        memoryLimit: 128,
        starterCode: `int main() {
    // 在这里编写你的代码

    return 0;
}`,
        expectedCode: `int main() {
    cls();
    speed(8);
    size(8);
    c(14);
    o(25);
    c(8);
    rr(60, 50);
    return 0;
}`,
        testCases: [
          {
            input: '无输入',
            expectedOutput: '绘制锁头：橙色半圆和灰色矩形',
            expectedTrace: [
              { cmd: 'cls', args: [] },
              { cmd: 'speed', args: [8] },
              { cmd: 'fd', args: [100] },
              { cmd: 'rt', args: [90] },
              { cmd: 'fd', args: [100] },
              { cmd: 'rt', args: [90] },
              { cmd: 'fd', args: [100] },
              { cmd: 'rt', args: [90] },
              { cmd: 'fd', args: [100] },
              { cmd: 'rt', args: [90] }
            ],
            score: 100
          }
        ]
      }
    }
  },
  methods: {
    onJudgeComplete(result) {
      logger.log('判题完成:', result)
      // 处理判题结果
    },
    onCodeSubmit(data) {
      logger.log('代码提交:', data)
      // 发送到后端
    },
    onError(error) {
      logger.error('错误:', error)
      // 处理错误
    }
  },
  
  beforeUnmount() {
    logger.log('🧹 [GocJudgePage] 页面即将卸载，清理资源')
    
    // 清理全局变量
    delete window.__gocUpdatePen
    delete window.__gocSetPenVisible
    
    logger.log('✅ [GocJudgePage] 页面清理完成')
  }
}
</script>

<style scoped>
.goc-judge-page {
  padding: 20px;
}
</style>